<!DOCTYPE html>
<html lang="zh-TW">
<head>
<meta charset="UTF-8" />
<title>全部貼文</title>
<link rel="stylesheet" href="../css/sunny/fontsize1.1/jquery-ui-1.10.4.custom.css">
	
<script src="../js/jquery-1.10.2.js"></script>
<script src="../js/jquery-ui-1.10.4.custom.js"></script>
<script src="../js/jquery.elastic.source.js"></script>
<script src="../js/jquery.jscroll.js"></script>

<style>
.searchbar{
/*background: -moz-radial-gradient(center, ellipse cover,  rgba(255,230,181,0.8) 0%, rgba(255,230,181,0.4) 99%, rgba(255,230,181,0.4) 100%); /* FF3.6+ */
/*background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(255,230,181,0.8)), color-stop(99%,rgba(255,230,181,0.4)), color-stop(100%,rgba(255,230,181,0.4))); /* Chrome,Safari4+ */
/*background: -webkit-radial-gradient(center, ellipse cover,  rgba(255,230,181,0.8) 0%,rgba(255,230,181,0.4) 99%,rgba(255,230,181,0.4) 100%); /* Chrome10+,Safari5.1+ */
/*background: -o-radial-gradient(center, ellipse cover,  rgba(255,230,181,0.8) 0%,rgba(255,230,181,0.4) 99%,rgba(255,230,181,0.4) 100%); /* Opera 12+ */
/*background: -ms-radial-gradient(center, ellipse cover,  rgba(255,230,181,0.8) 0%,rgba(255,230,181,0.4) 99%,rgba(255,230,181,0.4) 100%); /* IE10+ */
/*background: radial-gradient(ellipse at center,  rgba(255,230,181,0.8) 0%,rgba(255,230,181,0.4) 99%,rgba(255,230,181,0.4) 100%); /* W3C */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ccffe6b5', endColorstr='#66ffe6b5',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
background: transparent;
/*padding-left: 30px;*/ 
/*padding-bottom: 10px;*/ 
position:fixed; 
top:0px; 
right:0px; 
z-index: 3;
border-radius: 10px;
}

.searchbartext{
position:relative;
vertical-align:middle;
top: 4px;
font-size: 14px;
font-family: "微軟正黑體";
width:110px;
background: transparent;
}

.block{
position: relative; 
margin: 10px; 
padding:10px; 
width: 600px; 
border-style:groove; 
border-width:5px 5px 1px 5px; 
border-color:blue; 
border-radius: 25px; 
background: rgb(223,243,249)
}

.iconinvisible{
	opacity: 0;
	filter: alpha(opacity =    0);
}

.iconvisible{
	opacity: 1;
	filter: alpha(opacity =    100);
}

</style>

<script>
	$(function() {
		$( ".elastic" ).elastic();
		$( '.scroll' ).jscroll();
		$(".block").hover(function(){
			$(".iconinvisible").toggleClass("iconvisible",300).clearQueue();
		});
	});
</script>

</head>

<body style="padding-top: 6px;">

	<div class="searchbar">
<input id="search" type="text" name="search" placeholder="搜尋 作者 或 內容"
				class="text ui-widget-content ui-corner-all searchbartext"><a href="#"><img src="../images/search.png" width="18" height="18" style="padding-left:5px; padding-right:2px; position:relative; top:9px;"></a></div>


	<div class="scroll" style="width: 700px;">
	<div class="block">
	<div style="position: relative;">
	<a href="#" style="position:absolute; right:5px; top:5px;" class="iconinvisible"><img src="../images/like.png"></a>
	<a href="#" style="position:absolute; right:5px; top:35px;" class="iconinvisible"><img src="../images/favorite.png"></a>
	<a href="#" style="position:absolute; right:5px; top:65px;" class="iconinvisible"><img src="../images/edit.png"></a>
	<a href="#" style="position:absolute; right:5px; top:95px;" class="iconinvisible"><img src="../images/delete.png"></a>
	</div>
	PO文者：會員01<br/>
	內容：<br/>
	LALALALA<br/>
	LALALALA<br/>
	LALALALA<br/>
	LALALALA<br/>
	LALALALA<br/>
	</div>
	<div style="position: relative; top:-10px; margin: 10px; padding:10px; width: 600px; border-style:groove; border-width:0px 5px 0px 5px; border-color:green; border-radius: 25px;; background: rgb(240,250,211)">
	留言者：<input id="comment01" type="text" name="comment01" placeholder="我要留言" class="text ui-widget-content ui-corner-all" style="position: relative; left: 2px;"><br/>
	<span style="position:absolute;vertical-align:middle;top:50%;">內容：</span>
	<textarea cols="60" rows="1" placeholder="我要留言" style="position: relative; left: 52px; resize: none; max-height:240px; margin-top:5px;"
		class="elastic text ui-widget-content ui-corner-all"></textarea>
		<br/>
	</div>
	<div style="position: relative; top:-20px; margin: 10px; padding:10px; width: 600px; border-style:groove; border-width:1px 5px 0px 5px; border-color:green; border-radius: 25px;; background: rgb(240,250,211)">
	留言者：AAA<br/>
	內容：LALALALA<br/>
	</div>
	<div style="position: relative; top:-30px; margin: 10px; padding:10px; width: 600px; border-style:groove; border-width:1px 5px 5px 5px; border-color:green; border-radius: 25px;; background: rgb(240,250,211)">
	留言者：AAA<br/>
	內容：LALALALA<br/>
	<div class="next"><a href="othercontent.html">next page</a></div>
	</div>
	</div>
	
	<!-- othercontent.html裡的全部內容原本放這 -->
</body>
</html>